<?php
/**
 * titre-sejour/index.phtml
 */
?>
<?php
$title = 'Titre de séjour';
$this->headTitle($title);
?>
<div class="content-head">
    <h3><?php echo $title; ?></h3>
    <div class="toolbar">
	<div class="toggle add" title="Ajouter">
            <a href="#" class='addTitle' style="display: block; width: 100%; height: 100%;"></a>
        </div>
    </div>
</div>

<div class="content-body">

    <div class="add-toggle">
	<table class="table table-striped list-table">
	    <thead>
		<tr>		    
		    <td width="45%">Libellé</td>
		    <td width="45%">Description</td>
		    <td width="10%">&nbsp;</td>
		</tr>
	    </thead>
	    <tbody>
		<tr>
		    <td>
			<a href="#" id="newLibelle" data-type="text"></a>
		    </td>
		    <td>
			<a href="#" id="newDescription" data-type="text"></a>
		    </td>
		    <td>
			<button id="newAdd" class="btn btn-success">Ajouter</button>
		    </td>
		</tr>
	    </tbody>
	</table>
	<form id="newForm" action="#" method="post">
	    <input type="hidden" id="data-libelle" name="libelle" value="">
	    <input type="hidden" id="data-description" name="description" value="">
	</form>
    </div>

    <!-- AJAX CONTENT -->
    <div id="content-data">
	<!-- AJAX LOADING -->
    </div>
</div>

<script type="text/javascript">
    // Démarrage
    $(function(){
	// Ajouter
	$('.addTitle').click(function(e){
	    e.preventDefault();
	    $('.add-toggle').toggle('normal');
	});

	// Nouveau libellé
	$('#newLibelle').editable({
	    title: "Nouveau Libellé",
	    validate: function(value){
		$('#data-libelle').val(value);
		affAddButton(verifyData(false));
	    }
	});

	// Nouvelle description
	$('#newDescription').editable({
	    title: "Novuelle Description",
	    validate: function(value){
		$('#data-description').val(value);
		affAddButton(verifyData(false));
	    }
	});

	// Ajouter nouveau
	$('#newAdd').click(function(e){
	    e.preventDefault();
	    if(!verifyData(true)) return false;
	    ajax = $.ajax({
		dataType: 'json',
		type: 'post',
		url: '<?php echo $this->url('RHX/default', array('controller'	 => 'titresejour', 'action'	 => 'add')) ?>',
		data : $('#newForm').serialize()
	    });
	    ajax.done(function(result){
		if(!result.done){
		    alert("Une erreur est survenue lors de l'insertion des données\n" + result.error);
		}
		window.location.reload();
	    });
	    ajax.fail(function(){
		alert("Une erreur est survenue lors de l'insertion des données");
		window.location.reload();
	    });
	});

	// Masquage du bouton
	affAddButton(false);

	// Affichage du contenu
	refresh();
    });

    /**
    * rafraichissement

     * @returns {undefined}     */
    function refresh(){
	ajax = $.ajax({
	    type: 'post',
	    url : '<?php echo $this->url('RHX/default', array('controller'	 => 'titresejour', 'action'	 => 'loadIndex')) ?>'
	});
	ajax.done(function(data){
	    $('#content-data').hide().html(data).fadeIn('normal');
	});
    }

    /**
     * Vérification des données
     * 
     * @param {Boolean} msg
     * @returns {Boolean}
     */
    function verifyData(msg){
	libelle = $('#data-libelle').val();
	libelle = $.trim(libelle);

	if(libelle === ''){
	    if(msg)alert("Le libellé ne peut pas être vide");

	    return false;
	}

	if(libelle.length < 3){
	    if(msg)alert("Le libellé est trop court");

	    return false;
	}

	return true;
    }

    /**
     * Affichage / Masquage du bouton d'ajout
     *
     * @param {Boolean} show
     * @returns {undefined}
     */
    function affAddButton(show){
	if(show){
	    $('#newAdd').show('normal');
	}else{
	    $('#newAdd').hide('normal');
	}
    }
</script>